<div class="dialog-container mdl-shadow--8dp mdl-layout--fixed-header SMES-dialog B0223-dialog" ng-init="init();"
     style="background-color: #fafafa;width:100%;height: 100%;">
    <div class="kmi-header-row">
        <div class="header-title" ng-bind="'B0223.title' | translate"></div>
        <div class="kmi-side-btn right" ng-click="dialog.back();">
            <img src="image/icons/clear.png"></img>
            <div class="kmi-can-click"></div>
        </div>
    </div>
    <div class="kmi-layout-main-content">
        <div class="kmi-layout-page">
            <div class="kmi-text-fields">
                <label class="label" ng-bind="'B0223.plot_no' | translate" ></label>
                <label class="value" style="flex:1.5;" ng-bind="dialog.plotItem.plot_no"></label>
                <!-- 20211103 modify by Alan for #0102336 : [良品入庫進行產品變更，產品變更的生產數量與良品入庫的轉出數量不符[耀億] -->
                <!-- 移除畫面上的「生產數量」欄位 -->
            </div>
            <div class="kmi-text-fields">
                <label class="label" ng-bind="'B0223.op_no' | translate" ></label>
                <label class="value" style="flex:1.5;" ng-bind="dialog.plotItem.op_no"></label>
                <label class="label" ng-bind="'B0223.op_name' | translate" ></label>
                <label class="value" ng-bind="dialog.plotItem.op_name"></label>
            </div>
            <div class="kmi-text-fields">
                <label class="label" ng-bind="'B0223.item' | translate" ></label>
                <label class="value" style="flex:1.5;" ng-bind="dialog.plotItem.item_no + ' ( ' + dialog.plotItem.item_name + ' )'"></label>
                <!--
                <label class="label" ng-bind="'B0223.item_name' | translate" ></label>
                <label class="value" ng-bind="dialog.plotItem.item_name"></label>
                -->
                <label class="label" ng-bind="'B0223.item_unit' | translate" ></label>
                <label class="value" ng-bind="dialog.plotItem.item_unit_no"></label>
            </div>
            <div class="kmi-list">
                <div class="kmi-list__header">
                    <div class="kmi-list__column head-controls " style="flex:1;">
                        <div class="order" ng-hide="joint_item_no_filter">
                            <i class="material-icons search" style="z-index:1;" ng-click="joint_item_no_filter = true">search</i>
                            <label ng-bind="'B0223.list.column1' | translate"></label>
                        </div>
                        <div class="filter" ng-show="joint_item_no_filter">
                            <input ng-model="dialog.List_filter.joint_item_no">
                            <i class="material-icons clear" style="position: absolute;top: 2px;right: 0px;" ng-show="joint_item_no_filter"
                               ng-click="joint_item_no_filter = false;dialog.List_filter.joint_item_no=''">clear</i>
                        </div>
                    </div>
                    <!--<div class="kmi-list__column" style="flex:1;" ng-bind="'B0223.list.column1' | translate" ></div>-->
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0223.list.column2' | translate" ></div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="'B0223.list.column3' | translate" ></div>
                </div>
                <div class="kmi-list__row-content">
                    <div class="kmi-list__row" ng-repeat="item in dialog.getPages(dialog.plotItem.joint_production_info_detail, dialog.List_PageConfig, dialog.List_filter) | filter : { joint_item_no : dialog.List_filter.joint_item_no}"
                        ng-class="{'is-select':dialog.selectItem.joint_item_no == item.joint_item_no}" ng-click="dialog.selectItem = item">
                        <div class="kmi-list__column column-border" style="flex:1;" ng-bind="item.joint_item_no"></div>
                        <div class="kmi-list__column column-border" style="flex:1;" ng-bind="item.joint_item_name"></div>
                        <div class="kmi-list__column" style="flex:1;" ng-bind="item.joint_item_unit_no"></div>
                    </div>
                </div>
            </div>
            <div class="page-content">
                <div class="page-icon">
                    <img src="image/icons/dropleft.png"></img>
                    <div class="kmi-can-click"  ng-click="dialog.List_PageConfig.page = (dialog.List_PageConfig.page-1<0?0:dialog.List_PageConfig.page-1);"></div>
                </div>
                <label ng-bind="(dialog.List_PageConfig.page +1)+' / '+dialog.List_PageConfig.total_page"></label>
                <div class="page-icon">
                    <img src="image/icons/dropright.png"></img>
                    <div class="kmi-can-click"  ng-click="dialog.List_PageConfig.page = (dialog.List_PageConfig.page+1>(dialog.List_PageConfig.total_page-1)?(dialog.List_PageConfig.total_page-1):dialog.List_PageConfig.page+1);"></div>
                </div>
            </div>
            <div class="btn-content">
                <div class="kmi-button kmi-button-confrim btn-confirm" ng-click="dialog.confirm()"  style="width:100px">
                    <label ng-bind="'common.btn.confirm' | translate"></label>
                    <div class="kmi-can-click" ></div>
                </div>
            </div>
        </div>
    </div>
</div>
